<template>
    <div class="registerSuccess-box">
        <div style="font-size:1.5rem;margin-top:1rem" class="registerSuccess-code-tit">
            钉钉扫码进入{{$store.state.activityName}}
        </div>
        <div class="registerSuccess-code-box">
            <div class="registerSuccess-code">
                <div id="qrcode" ref="qrcode" class="hd-img"></div>
            </div>
        </div>
        <div style="font-size:1.25rem;margin-top:2rem" class="registerSuccess-code-tit">
            还没有钉钉？扫码也可下载
        </div>
        <div style="margin-top:1em" class="registerSuccess-code-box">
            <div class="registerSuccess-code">
                <img src="https://gw.alicdn.com/tfs/TB1J.rSwGmWBuNjy1XaXXXCbXXa-280-280.png">
            </div>
        </div>
    </div>
</template>
<script>
import QRCode from "qrcodejs2"

export default {
  data() {
    return {
      qrcodeNew: "",
      imgCode: ""
    };
  },
  created() {
    this.imgCode = this.$route.params.code
  },
  mounted() {
    this.getNewCode()
  },
  methods: {
    getCodeNum() {
      this.qrcodeNew.makeCode(this.imgCode)
    },
    //生成二维码
    getNewCode() {
      this.qrcodeNew = new QRCode(this.$refs.qrcode, {
        width: 168,
        height: 168,
        text: this.imgCode
      });
      this.getCodeNum();
    }
  }
}
</script>

<style scoped>
.registerSuccess-box {
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  position: fixed;
  left: 0rem;
  top: 0rem;
  z-index: 101;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  padding: 1.6rem 1rem 2rem 1rem;
}
/* a */

.registerSuccess-tit {
  width: 100%;
  height: auto;
  font-size: 1.35rem;
  color: #3a3a3a;
  line-height: 2.26rem;
  margin: 3rem 0rem;
}
.registerSuccess-code-tit {
  font-size: 1.5rem;
  color: #3a3a3a;
  width: 100%;
  height: auto;
  margin: 2rem 0rem;
}
.registerSuccess-code-box {
  width: 100%;
  height: auto;
  display: flex;
  -webkit-display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  padding-right: 1rem;
}
.registerSuccess-code {
  width: 13rem;
  height: auto;
  margin: auto;
  padding: 0.5rem;
}
.registerSuccess-code > img {
  width: 13.5rem;
  height: auto;
}
</style>
